@import 'compass';

@function get-color-mode($color) {
  @if lightness($color) > 50 {
    @return light;
  } @else {
    @return dark;
  }
}

$base-color: blue !default;
$neutral-color: #ccc !default;
$base-gradient: matte !default;
$default-text-contrast: 85%;
$color-mode: get-color-mode($neutral-color) !default;

@function color-offset($color, $contrast: 85%, $mode: $color-mode, $inverse: false) {
  $flat_color: check-opacity($color);

  @if $mode == inverse {
    $mode: reverse-color-mode($color-mode);
  }

  @if $inverse == true {
    $mode: reverse-color-mode($mode);
  }

  @if ($mode == light) {
    @return rgba(lighten($flat_color, $contrast), opacity($color));
  } @else if ($mode == dark) {
    @return rgba(darken($flat_color, $contrast), opacity($color));
  } @else {
    @debug $mode " is not a valid color mode. Use light, dark, or inverse.";
    @return white;
  }
}

@function reverse-color-mode($mode) {
  @if $mode == dark {
    @return light;
  } @else {
    @return dark;
  }
}

@function check-opacity($color) {
  @if (opacity($color) == 0) {
    $color: opacify($color, 1);
  }
  @if $color == transparent {
    $color: opacify($color, 1);
  }
  @return $color;
}

@function color-by-background($bg-color, $contrast: $default-text-contrast) {
  $bg-color: check-opacity($bg-color);
  $tmpmode: get-color-mode($bg-color);

  @return color-offset($bg-color, $contrast, $tmpmode, $inverse: true);
}

@function get-inset-offset($mode) {
  @if $mode == light {
    @return 1px;
  } @else {
    @return -1px;
  }
}

@mixin color-by-background($bg-color, $contrast: $default-text-contrast, $default-color: false, $inset-text: true) {
  @if $default-color {
    color: color-by-background(hsla(hue($default-color), saturation($default-color), lightness($bg-color), opacity($bg-color)), $contrast);
  } @else {
    color: color-by-background($bg-color, $contrast);
  }

  @if $inset-text {
    @include inset-by-background($bg-color);
  }
}


@mixin inset-by-background($bg-color, $contrast: 10%, $box: false) {

  $bg-color: check-opacity($bg-color);
  $offset: get-inset-offset(get-color-mode($bg-color));

  @if ($box == true) {
    @include box-shadow(color-offset($bg-color, $contrast, $mode: get-color-mode($bg-color)) 0 $offset 0);
  }

  @include text-shadow(color-offset($bg-color, $contrast, $mode: get-color-mode($bg-color)) 0 $offset 0);
}